import { VerticalBox , HorizontalBox} from "std-widgets.slint";
import { Progress } from "../widgets/progress.slint";

export component CellWidget inherits Rectangle {
    background: #ffffff;
    border-radius: 5px;
    drop-shadow-blur: 10px;
    drop-shadow-color: #eee;
    drop-shadow-offset-x: 10px;
    drop-shadow-offset-y: 10px;

    in property <float> voltage;
    in property <int> cell-number;
    in property <int> balance: 0;
    property <color> _color : voltage >= 3.2 && voltage <= 4.2 ? #45d845 
        : voltage >= 2.7 && voltage < 3.2 ? #ff9100 : #ea5656;
    property <float> p : (voltage - 2.7) / (4.2 - 2.7);
    VerticalBox {
        padding: 10px;
        padding-bottom: 5px;
        Text {
            text: "CELL-" + cell-number;
            font-size: 14px;
            color: #999;
        }
        Text {
            horizontal-alignment: center;
            text: voltage + "V";
            font-weight: 800;
            font-size: 25px;
            color: _color;
        }
        Progress {
            height: 5px;
            progress: p < 0.0 ? 0.0 : p > 1.0 ? 1.0 : p;
            progress-color: _color;
        }
        Rectangle {
            padding: 0px;
            border-radius: 2px;
            height: 15px;
            Text {
                text: balance == 1 ? "Balance" : "";
                color: white;
                font-weight: 600;
            }
            background: balance == 1 ? red : root.background;
        }
    }
}